<template>
  <div class="filed-div">
    <h1>登录页面</h1>
    <div class="field-div">
      <label>用户名：</label>
      <input placeholder="请输入账号" v-model="username">
    </div>
  </div>
  <div class="filed-div">
    <label>密码：&nbsp;&nbsp;</label>
    <input placeholder="请输入密码" v-model="password" type="password">
  </div>
  <div class="filed-div">
    <button @click="login">登录</button>
  </div>
</template>

<script setup>


import {ref} from "vue";
import router from "@/router/index.js";
import api from "@/router/axios.js";
let username = ref("");
let password = ref("");
function login(){
  api({url:"/login",// 访问后台的后缀
    params:{//提交的参数要与mapper.xml中的#{}一致
    "username":username.value,"password":password.value}
  }).then(resp=>{ // 回调函数
    alert(resp.data.message)
    if(resp.data.code==1)
        router.push("/index"); // 跳转到系统主页

  })
}

</script>

<style scoped>

</style>